@import "calypso/assets/stylesheets/shared/mixins/breakpoints";

.back-button {
	margin: 0;
	position: fixed;
	top: calc(var(--masterbar-height) + 20px);
	left: 0;
	z-index: z-index(".masterbar", ".reader-back");

	.button.is-compact.is-borderless {
		padding: 20px 8px 16px;

		@include breakpoint-deprecated( ">660px" ) {
			padding: 18px 40px 18px 10px;
		}
	}

	@include breakpoint-deprecated( "<660px" ) {
		display: none;
	}
}

.back-button__example {
	.back-button {
		position: relative;
		top: 0;

		.button.is-compact.is-borderless {
			padding: 0;
		}
	}
}
